<!DOCTYPE html>
<html>
    <title>This is a exercise</title>

    <head>
        <!-- 在 <head>元素中可以插入脚本（scripts）, 样式文件（CSS），及各种meta信息。
             可以添加在头部区域的元素标签为: <title>, <style>, <meta>, <link>, <script>, <noscript> 和 <base>。 -->


        <meta charset="utf-8" http-equiv="refresh" content="5">
        <!-- 标签提供了元数据.元数据也不显示在页面上，但会被浏览器解析。
             META 元素通常用于指定网页的描述，关键词，文件的最后修改时间，作者，和其他元数据。 
             charset后面跟编码格式 
             http-equiv="refresh"为自动刷新网页，content后面的数字是自动刷新的间隔时长 
            meta中的元数据通常成对出现，即名称（name）和值（content）-->
        <meta name="description" content="这是一个网页代码练习">

        <link rel="stylesheet" type="" href="0-css.css">
        <!-- link表示当前文档与外部资源的关系，rel表示关系，href表示外部资源路径，type表示类型。
            例如示例中stylesheet表示导入外部样式表的url，href为样式表的路径，该语句将0-css.css中的样式导入当前网页，
            可以在网页主体代码中直接使用样式表中的样式 -->
    </head>

    <body>
        <p>This is a exercise</p>
        <br>
        <a href="https://www.bilibili.com/">点击此处跳转b站</a>
        <br>
        <br>
        <a href="https://www.bilibili.com/" target="_blank" title="bilibili">点击此处在新窗口跳转b站</a>
        <br>
        <!-- 注意target属性在HTML5中不被支持 -->
        <br>
        <a href="https://www.bilibili.com/" target="_blank" title="bilibili">
            <img src="../img/bilibili-logo.jpg" alt="点击跳转BiliBili" width="500px" height="140px">
        </a>

        <!-- 块级元素，独占一行（相当于执行了display：block 操作），宽高可控，如果不进行设置则会沾满父级元素 ，其内部可以包含块级元素和行级元素。-->
        <div>div</div>
        <p style="width: 120px; height: 200px; background-color: rgb(255, 0, 0);">
            这是一个段落
            <q>这是一句话</q>
            <strong>这是一句着重</strong>
            <em>这是一句斜体</em>
        </p>
        <address>
            <p>Tel:</p>
            <p>Add:</p>
        </address>

        <table>
            <caption>电话簿</caption>
            <tr>
                <th>姓名</th>
                <th>电话</th>
            </tr>

            <tr>
                <td>张三</td>
                <td>123 4568</td>
            </tr>
        </table>
        <!-- 行级元素不会独占一行（相当于执行了display：inline 操作），与相邻的行级元素共占一行，直到当前行沾满后自动跳到到下一行，宽度高度均不可设置，其内只能包含行级元素 -->
        <strong>这是一个行级元素</strong>
        <span>111</span>

        <br>
        <br>

        

    </body>
</html>
